<template>
    <lightning-card title="CompositionIteration" icon-name="custom:custom57">
        <div class="slds-var-m-around_medium">
            <template for:each={contacts} for:item="contact">
                <c-contact-tile
                    class="slds-show slds-is-relative"
                    key={contact.Id}
                    contact={contact}
                ></c-contact-tile>
            </template>
        </div>

        <c-view-source source="lwc/compositionIteration" slot="footer">
            Loop through an array of items in a template, and nest an instance
            of a child component for each item in the array.
        </c-view-source>
    </lightning-card>
</template>
